<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

    <h1 id="showTime"></h1>

    <script>

        var oDiv = document.getElementById('showTime') ;

        // 页面一打开的时候，立即执行一次
        oDiv.innerHTML = formatDate() ;

        // 每隔一秒，显示一下当前时间

        // 页面打开的时候，会出现1s的空白
        setInterval(function(){
            // document.write(formatDate())
            oDiv.innerHTML = formatDate() ;
        } , 1000)

        
        function formatDate() {
            var date = new Date();
            // 获取年
            var year = date.getFullYear();

            // 获取月
            //    月从0开始
            var month = date.getMonth() + 1;

            // 获取日期
            var day = date.getDate();

            // 获取星期
            //   星期也是从0开始的，一个星期的第一天是星期天
            //   0就是星期天   1就是星期一
            var week = date.getDay();

            var arr = ['天' , '一' , '二' , '三' , '四' , '五' , '六'] ;

            // 获取小时
            var hour = date.getHours();

            // 获取分钟
            var minute = date.getMinutes();

            // 获取秒
            var second = date.getSeconds();

            return `${year}-${addZero(month)}-${day} 星期${arr[week]} ${addZero(hour)}:${addZero(minute)}:${addZero(second)}`   // 补零

        }


        function addZero(n) {
            return n < 10 ? '0' + n : n
        }


      
    </script>
    
</body>
</html>